<!--
* @description 白玉京账号列表
* @fileName userAccount.vue
* @author huangyu
* @date 2023/05/10 21:11:52
!-->
<template>
    <div class="zx-container">
        <div style="padding-bottom:20px;" v-if="token&&powerCian">
            管理员权限：
            <!-- <el-switch v-model="isOpen" active-text="开启提交" inactive-text="关闭提交" @change="changeIsOpen"></el-switch> -->
            <el-button size="mini" type="primary" @click="clickAccountList">查看所有账号信息</el-button>
        </div>

        <el-form label-width="140px" style="width:550px">
            <el-form-item label="微信名称">
                <el-input v-model="accountForm.cWeiXin" placeholder="请填写微信号"></el-input>
            </el-form-item>
            <el-form-item label="QQ号">
                <el-input v-model="accountForm.cQQ" placeholder="请填写qq"></el-input>
            </el-form-item>
            <el-form-item label="大号游戏名称">
                <el-input v-model="accountForm.cCountMain" placeholder="请填写大号游戏名称"></el-input>
            </el-form-item>
            <el-form-item label="小号1">
                <el-input v-model="accountForm.cCount1" placeholder="请输入游戏名称"></el-input>
            </el-form-item>
            <el-form-item label="小号2">
                <el-input v-model="accountForm.cCount2" placeholder="请输入游戏名称"></el-input>
            </el-form-item>
            <el-form-item label="小号3">
                <el-input v-model="accountForm.cCount3" placeholder="请输入游戏名称"></el-input>
            </el-form-item>
            <el-form-item label="小号4">
                <el-input v-model="accountForm.cCount4" placeholder="请输入游戏名称"></el-input>
            </el-form-item>
            <el-form-item label="小号5">
                <el-input v-model="accountForm.cCount5" placeholder="请输入游戏名称"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="clickSubmit">提交</el-button>
            </el-form-item>
        </el-form>

        <el-dialog title="所有账号信息列表" top="50px" :visible.sync="dialogAccountList" v-dialogDrag>
            <el-table :data="accountList" border max-height="680px">
                <el-table-column type="index" width="50" label="序号"></el-table-column>
                <el-table-column label="微信名称" prop="cWeiXin"></el-table-column>
                <el-table-column label="QQ号" prop="cQQ"></el-table-column>
                <el-table-column label="大号" prop="cCountMain"></el-table-column>
                <el-table-column label="小号1" prop="cCount1"></el-table-column>
                <el-table-column label="小号2" prop="cCount2"></el-table-column>
                <el-table-column label="小号3" prop="cCount3"></el-table-column>
                <el-table-column label="小号4" prop="cCount4"></el-table-column>
                <el-table-column label="小号5" prop="cCount5"></el-table-column>
            </el-table>
        </el-dialog>
    </div>
</template>

<script>
import { get } from '@/common/app.js'
export default {
    components: {},
    data() {
        return {
            token: this.$store.state.token,
            accountForm: {
                cWeiXin: "",
                cQQ: "",
                cCountMain: "",
                cCount1: "",
                cCount2: "",
                cCount3: "",
                cCount4: "",
                cCount5: "",
            },
            dialogAccountList: false,
            accountList: [],
            isOpen: true,
            powerCian: this.$power.roleAction('cian'),
        }
    },
    mounted() {
        this.getDetail()
    },
    methods: {
        getDetail(){
            if(this.token){
                let params = {
                    type: 'getUser',
                    api: 'api-user-account-detail',
                    token: this.token,
                    data: {},
                }
                get('game', params).then(res => {
                    if (res) {
                        this.accountForm = {...res}
                    }
                })
            }
        },
        clickSubmit(){
            if(this.token){
                let params = {
                    type: 'getUser',
                    api: 'api-user-account-add',
                    token: this.token,
                    data: this.accountForm,
                }
                get('game', params).then(res => {
                    if (res) {
                        this.$message.success("提交成功！")
                        this.getDetail()
                    }
                })
            }else{
                this.$message.error("请先登录")
            }
        },

        clickAccountList(){
            this.dialogAccountList = true
            this.getAccountList()
        },
        getAccountList(){
            if(this.token&&this.powerCian){
                let params = {
                    type: 'getUser',
                    api: 'api-user-account-list',
                    token: this.token,
                    data: {},
                }
                get('game', params).then(res => {
                    if (res) {
                        this.accountList = res
                    }
                })
            }else{
                this.$message.error("请先登录")
            }
        },

        // changeIsOpen(){
        //     let params = {
        //         type: 'getUser',
        //         api: 'api-user-account-add',
        //         token: this.token,
        //         data: {
        //             isOpen: this.isOpen
        //         },
        //     }
        //     get('game', params).then(res => {
        //         if (res) {
        //             this.$message.success("设置成功！")
        //         }
        //     })
        // },

    },
}
</script>

<style scoped>

</style>